<template>
	<div>
		<van-row style="width: 100vw;height: 7vh;position: fixed;top: 0px;background-color: #fff;z-index: 99;">
			<van-col span="18">
				<van-icon name="arrow-left" style="font-weight: bolder;margin-top: 5px;margin-right: 60vw;" size="25" @click="back"/>
			</van-col>
			<van-col span="3">
				<van-icon name="guide-o" style="font-weight: bolder;margin-top: 5px;" size="25" @click="showShares"/>
			</van-col>
			<van-col span="3">
				<van-icon name="comment-o" style="font-weight: bolder;margin-top: 5px;" size="25" />
			</van-col>
		</van-row>
		<van-row style="width: 100vw;height: 7vh;">
			<van-col span="18">
				<van-icon name="arrow-left" style="font-weight: bolder;margin-top: 5px;margin-right: 60vw;" size="25" @click="back"/>
			</van-col>
			<van-col span="3">
				<van-icon name="guide-o" style="font-weight: bolder;margin-top: 5px;" size="25" />
			</van-col>
			<van-col span="3">
				<van-icon name="comment-o" style="font-weight: bolder;margin-top: 5px;" size="25" />
			</van-col>
		</van-row>
		<van-share-sheet
		  v-model="showShare"
		  title="立即分享给好友"
		  :options="options"
		/>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				showShare: false,
				      options: [
				        [
				          { name: '微信', icon: 'wechat' },
				          { name: '朋友圈', icon: 'wechat-moments' },
				          { name: '微博', icon: 'weibo' },
				          { name: 'QQ', icon: 'qq' },
				        ],
				        [
				          { name: '复制链接', icon: 'link' },
				          { name: '分享海报', icon: 'poster' },
				          { name: '二维码', icon: 'qrcode' },
				          { name: '小程序码', icon: 'weapp-qrcode' },
				        ],
				      ]
			}
		},
		methods:{
			back(){
				this.$router.push({path:'/'})
			},
			showShares(){
				this.showShare=true
			}
		}
	}
</script>

<style>
</style>
